<!DOCTYPE html>
<style>
    .columns { -webkit-column-count:2; -webkit-column-gap:20px; column-fill:auto; border:2px solid black; width:520px; height:300px }
    .block { height:200px; }
</style>
<p>The four rectangles below should both be at the top of their columns. If one is lower than the
    other, the test has failed. The pattern in each column should be the same (orange/yellow).</p>
<div class="columns">
    <table cellpadding=0 cellspacing=0 border=0 width="100%">
        <tr>
            <td width="50%">
                <div class="block" style="margin-bottom:200px; background-color:orange"></div>
                <div class="block" style="background-color:orange"></div>
            </td>
            <td width="50%">
                <div class="block" style="margin-bottom:200px; background-color:yellow"></div>
                <div class="block" style="background-color:yellow"></div>
            </td>
        </tr>
    </table>
</div>
